import React, { Component } from 'react';

class Child extends Component {

  constructor() {
    super();
    this.state = {
      name: 'hanye'
    }
  }

  //可以拿到父组件传递过来的属性，同时可以拿到当前组件的state
  static getDerivedStateFromProps(props, state) {
    console.log('getDerivedStateFromProps:', props, state)
    return {
      ...props,
      ...state
    }
  }

  render() {
    console.log('child render')
    return (
      <div>
        我是子组件
        child - {this.props.count}-{this.state.name}
      </div>
    );
  }

  componentDidMount() {
    this.timer = setTimeout(() => {
      console.log('update')
      this.setState({
        count: 10
      })
    }, 5000)
  }

  componentWillUnmount() {
    console.log('componentWillUnmount')
    clearTimeout(this.timer)
  }

  getSnapshotBeforeUpdate(prevProps, prevState) {
    console.log("getSnapshotBeforeUpdate:", prevProps, prevState)
    return {
      username:'hanye',
      age:20
    };
  }

  componentDidUpdate(prevProps, prevState,sanpshot){
console.log("componentDidUpdate:",prevProps, prevState,sanpshot)
  }

}

export default Child;